<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>CSS3侧边栏单页切换小图标菜单DEMO演示来自：https://www.17sucai.com/pins/demo-show?id=43354</title>
		<meta name="designer" content="Alberto Hartzet">
		<meta name="programer" content="Alberto Hartzet">
		<meta name="author" content="Alberto Hartzet">
		<meta name="description" content="One page navigation with pure CSS">
		<meta property="og:url" content="https://codepen.io/hrtzt/details/NPZKRN">
		<meta property="og:image" content="https://pbs.twimg.com/media/CCNJN_XUMAAJSzU.jpg:large">

		<link rel="stylesheet" href="./static/css/reset.css">

		<link rel='stylesheet prefetch'
			href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.3.0/css/font-awesome.css'>

		<link rel="stylesheet" href="./static/css/style.css">

	</head>

	<body>
		<div class="ct" id="t1">
			<div class="ct" id="t2">
				<div class="ct" id="t3">
					<div class="ct" id="t4">
						<div class="ct" id="t5">
							<ul id="menu">
								<a href="#t1">
									<li class="icon fa fa-bolt" id="uno"></li>
								</a>
								<a href="#t2">
									<li class="icon fa fa-keyboard-o" id="dos"></li>
								</a>
								<a href="#t3">
									<li class="icon fa fa-rocket" id="tres"></li>
								</a>
								<a href="#t4">
									<li class="icon fa fa-dribbble" id="cuatro"></li>
								</a>
								<a href="#t5">
									<li class="icon fa fa-plus-circle" id="cinco"></li>
								</a>
							</ul>
							<div class="page" id="p1">
								<section class="icon fa fa-bolt"><span class="title">Bolt</span><span class="hint">Like
										this pen to see the magic!...<br> Just kidding, it won't happen anything but
										I'll be really happy If you do so.</span></section>
							</div>
							<div class="page" id="p2">
								<section class="icon fa fa-keyboard-o"><span class="title">Type</span></section>
							</div>
							<div class="page" id="p3">
								<section class="icon fa fa-rocket"><span class="title">Rocket</span></section>
							</div>
							<div class="page" id="p4">
								<section class="icon fa fa-dribbble">
									<span class="title">Dribbble</span>
								</section>
							</div>
							<div class="page" id="p5">
								<section class="icon fa fa-plus-circle">
									<span class="title">More</span>
								</section>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>

	</body>
</html>
